<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.prime.com.tr/ui">
    <h:head>
        <title>New Invoice</title>
    </h:head>
    <h:body>

        <h:form>
            <f:view beforePhase="#{UserDisplayManagedBean.doDisplay}">
                <f:view beforePhase="#{InvoiceManagedBean.initView}">
                    <p:growl id="notif" showDetail="true"/>  
                    <p:poll interval="5"   
                            actionListener="#{MessageManagedBean.checkNewMessage}" immediate="true" update="notif" />
                      <!-- IDLE DIALOG for -->
                        <p:confirmDialog message="You have been idle for 5 minutes. Do you want to continue?"  
                                         showEffect="bounce" hideEffect="explode"  
                                         header="Warning message" severity="alert" widgetVar="confirmation">  
                            <p:commandButton value="Yes" onclick="confirmation.hide()" type="button" /> 
                            <p:commandButton value="No" update="panel" oncomplete="confirmation.hide()"  
                                             actionListener="#{UserManagedBean.doLogout}" /> 
                        </p:confirmDialog>
                    <div id="header">
                        <h:graphicImage value="/image/newHeader.jpg"/>

                    </div>

                    <div id="content">
                        <table>
                            <tr>                    
                                <td style="vertical-align:top">
                                    <p:toolbar style="font-size:80%;height:33px;width:207px"> 
                                        <p:toolbarGroup align="right">
                                            <p:button title="Home" image="ui-icon-home" outcome="FinanceDeptWorkspace"/>
                                            <p:button title="Notes" image="ui-icon-note" outcome="tasks"/>
                                            <p:button title="Mail" outcome="messages" image="ui-icon-mail-closed"/>     
                                            <p:button title="Edit Preferences" image="ui-icon-gear"/>
                                            <p:button title="Help" image="ui-icon-help"/>
                                            <p:commandButton immediate="true" type="submit" image="ui-icon-close" actionListener="#{UserManagedBean.doLogout}"/> 
                                        </p:toolbarGroup>
                                    </p:toolbar>

                                    <p:menu id="menu" style=" width:205px;height: 580px;font-family: Tahoma;border-style: double;font-size: 80%">  
                                        <p:submenu label="Finance Menu">  
                                            <p:menuitem value="Finance Dept Home" url="http://localhost:8080/MerlionERP-war/FRM/FinanceDeptWorkspace.xhtml" ajax="false" icon="ui-icon ui-icon-home"/>  
                                        </p:submenu>
                                        <p:submenu label=" Credit Profiles">
                                            <p:menuitem value="Add New Credit Profile" url="http://localhost:8080/MerlionERP-war/FRM/addCreditProfile.xhtml" ajax="false" icon="ui-icon ui-icon-document"/>  
                                            <p:menuitem value="View Credit Profiles" url="http://localhost:8080/MerlionERP-war/FRM/viewCreditProfile.xhtml" ajax="false" icon="ui-icon ui-icon-search" />
                                            <p:menuitem value="Perform Credit Check" url="http://localhost:8080/MerlionERP-war/FRM/CreditCheck.xhtml" ajax="false" icon="ui-icon ui-icon-search" />
                                        </p:submenu>
                                        <p:submenu label=" Invoices">
                                            <p:menuitem value="Add New Invoice" url="http://localhost:8080/MerlionERP-war/FRM/addInvoice.xhtml"   ajax="false" icon="ui-icon ui-icon-document" />
                                            <p:menuitem value="View All Invoices" url="http://localhost:8080/MerlionERP-war/FRM/viewInvoice.xhtml"   ajax="false" icon="ui-icon ui-icon-search" />
                                            <p:menuitem value="View Outstanding Invoices" url="http://localhost:8080/MerlionERP-war/FRM/viewOutstandingInvoice.xhtml"   ajax="false" icon="ui-icon ui-icon-search" />
                                            <p:menuitem value="View Overdue Invoices" url="http://localhost:8080/MerlionERP-war/FRM/viewOverdueInvoice.xhtml"   ajax="false" icon="ui-icon ui-icon-search" />
                                        </p:submenu>
                                        <p:submenu label="Refund">
                                            <p:menuitem value="View Pending Refunds" url="http://localhost:8080/MerlionERP-war/FRM/ViewRefundEntity.xhtml"   ajax="false" icon="ui-icon ui-icon-document" />
                                        </p:submenu>
                                        <p:submenu label="Payment">
                                            <p:menuitem value="Perform Customer Payment" url="http://localhost:8080/MerlionERP-war/FRM/PerformPayment.xhtml"   ajax="false" icon="ui-icon ui-icon-cart" />
                                            <p:menuitem value="View Payment History" url="http://localhost:8080/MerlionERP-war/FRM/ViewCustomerPaymentJournal.xhtml"   ajax="false" icon="ui-icon ui-icon-search" />

                                        </p:submenu>
                                    </p:menu>

                                    <p:calendar mode="inline" style="font-size:11px;font-family:Tahoma"/>
                                </td>
                                 
                                <td style="vertical-align: top">
                                    
                                   
                                    <h:graphicImage value="invoice_icon.jpg" style="width:35px;height:35px" />
                                    <h:outputText value="         "/>
                                    <h:outputText value="Create Invoice" style="font-family:Tahoma;font-size:20px;font-weight:bolder"/>
                                    <p:spacer width="100" height="10"/>

                                    <p:panel id="panel" style="border-style: outset;font-family: Tahoma;width:1123px;height:743px" >
                                        <center>


                                            <table style="font-size: 16px; font-family: Tahoma;border-bottom-color: lightgrey; border-bottom-style:  inset;width: 80%; ">
                                                <tr>
                                                    <td colspan="4"><h2>Sales Order Data</h2></td>
                                                </tr>
                                                <tr height="30px">
                                                    <td width="50%"> <h:outputText value="Sales Order ID*"/></td>
                                                    <td> <h:outputText value=":"/></td>
                                                    <td>
                                                        <h:selectOneMenu required="true" requiredMessage="Sales Order ID is required" value="#{InvoiceManagedBean.salesOrderId}">
                                                            <f:selectItem itemLabel="Select Sales Order ID" itemValue=""/>
                                                            <f:selectItems value="#{InvoiceManagedBean.salesOrders}" var="salesOrdering"
                                                                           itemLabel ="#{salesOrdering.id}" itemValue="#{salesOrdering.id}"/>
                                                            <p:ajax update="payMethod" listener="#{InvoiceManagedBean.doGetPaymentMethods}"/>
                                                        </h:selectOneMenu>
                                                    </td>
                                                </tr>
                                                <tr height="10px"> </tr>
                                            </table>
                                            <p:spacer height="10px" width="100px"/>
                                            <table style="font-size: 16px; font-family: Tahoma;border-bottom-color:  lightgrey; border-bottom-style:  inset;width: 80%; ">
                                                <tr>
                                                    <td colspan="4"><h2>Invoice Date</h2></td>
                                                </tr>
                                                <tr height="30px">
                                                    <td width="50%"> <h:outputText value="Issue Date*"/></td>
                                                    <td> <h:outputText value=":"/></td>
                                                    <td> <p:calendar value="#{InvoiceManagedBean.issueDate}" pattern="dd/MMM/yyyy" required="true" requiredMessage="Issue Date is required"/> </td>
                                                </tr>
                                                <tr height="30px">
                                                    <td width="50%"> <h:outputText value="Due date*"/></td>
                                                    <td> <h:outputText value=":"/></td>
                                                    <td> <p:calendar value="#{InvoiceManagedBean.invoiceDueDate}" pattern="dd/MMM/yyyy" required="true" requiredMessage="Due Date is required"/></td>
                                                </tr>
                                                <tr height="10px"> </tr>
                                            </table>
                                            <p:spacer height="10px" width="100px"/>

                                            <table style="font-size: 16px; font-family: Tahoma;border-bottom-color:  lightgrey; border-bottom-style:  inset;width: 80%; ">
                                                <tr>
                                                    <td colspan="4"><h2>Invoice Details</h2></td>
                                                </tr>
                                                <tr height="30px">
                                                    <td width="50%"> <h:outputText value="Credit term"/></td>
                                                    <td> <h:outputText value=":"/></td>
                                                    <td>
                                                        <h:outputText value="30 days (default)"/>
                                                    </td>
                                                </tr>
                                                <tr height="30px">
                                                    <td width="50%"> <h:outputText value="Discounted Term*"/></td>
                                                    <td> <h:outputText value=":"/></td>
                                                    <td> 
                                                        <h:selectOneMenu required="true" value="#{InvoiceManagedBean.discountedCreditTerm}" requiredMessage="Discounted Credit Term is required">
                                                            <f:selectItem itemLabel="3 days" itemValue="3"/>
                                                            <f:selectItem itemLabel="7 days" itemValue="7"/>
                                                            <f:selectItem itemLabel="10 days" itemValue="10"/>
                                                            <f:selectItem itemLabel="15 days" itemValue="15"/>
                                                            <f:selectItem itemLabel="30 days" itemValue="30"/>
                                                        </h:selectOneMenu>
                                                    </td>
                                                </tr>
                                                <tr height="30px">
                                                    <td width="50%"> <h:outputText value="Payment Method*"/></td>
                                                    <td> <h:outputText value=":"/></td>
                                                    <td> 
                                                        <h:selectOneMenu id="payMethod" required="true" value="#{InvoiceManagedBean.paymentMethod}" requiredMessage="Payment method is required">
                                                            <f:selectItem itemLabel="Select Payment method" itemValue=""/>
                                                            <f:selectItems value="#{InvoiceManagedBean.paymentMethods}" var="payMethod"/> 
                                                        </h:selectOneMenu>
                                                    </td>
                                                </tr>
                                                <tr height="10px"> </tr>
                                            </table>
                                            <p:spacer height="50px" width="100px"/>

                                            <p:commandButton onclick="dialog.show()" update="panel" image="ui-icon ui-icon-disk" value="Add Invoice" type="submit" />
                                            <p:commandButton value="Reset" image="ui-icon ui-icon-refresh" type="reset" />
                                            <p:messages/>
                                        </center>
                                        <p:ajaxStatus style="width:16px;height:16px;">
                                        <f:facet name="start">
                                            <h:graphicImage value="../design/ajaxloading.gif" />
                                        </f:facet>
                                        <f:facet name="complete">
                                            <h:outputText value="" />
                                        </f:facet>
                                    </p:ajaxStatus>
                                    </p:panel>


                                    <!--DIALOG FOR ADD-->
                                    <p:confirmDialog message="Are you sure you want to add a new invoice?"  
                                                     showEffect="blind" hideEffect="explode"  
                                                     header="Create an Invoice" severity="alert" widgetVar="dialog">  
                                        <p:commandButton value="Yes" image="ui-icon ui-icon-disk" update="panel" ajax="true" immediate="true" oncomplete="dialog.hide()"  
                                                         actionListener="#{InvoiceManagedBean.doSearchInvoice}" />  
                                        <p:commandButton value="No" image="ui-icon ui-icon-close" onclick="dialog.hide()" type="button" />   
                                    </p:confirmDialog>  
                                </td>
                            </tr>
                        </table>
                    </div>

                    <div id="top" class="top">
                        <h:graphicImage value="../image/merlionfooter.jpg"/>
                    </div>
                </f:view>
            </f:view>
        </h:form>

    </h:body>
</html>
